<template>
  <div>
    <!-- 个人地址 -->
    <div class="header">
      <van-sticky>
        <van-nav-bar
          title="我的常用地址"
          left-text="返回"
          left-arrow
          @click-left="onClickLeft"
        />
      </van-sticky>
    </div>
    <!-- 我的地址 -->
    <div class="address">
      <van-address-list
        v-model="chosenAddressId"
        :list="addressList"
        default-tag-text="常用"
        @add="onAdd(userall.id)"
        @edit="onEdit"
      />
    </div>
  </div>
</template>

<script>
import { get, post } from "@/http/axios";
import { AddressList } from "vant";
export default {
  data() {
    return {
      chosenAddressId: "1",

      addressData: [],

      userall: this.$route.query,
    };
  },
  methods: {
    //获取地址 val:this.$route.query.id
    async getUseraddress(val) {
      let obj = {
        page: 1,
        pageSize: 100,
        userId: val,
      };
      let res = await get("/address/pageQuery", obj);
      //获取地址
      this.addressData = res.data.data;
    },
    onClickLeft() {
      this.$router.push({
        path: "/manager/mine",
      });
    },
    onAdd(userid) {
      //拿到用户id
      this.$router.push({
        path: "/manager/addressedit",
        query: {
          userid,
        },
      });
    },
    onEdit(item, index) {
      let userid=this.userall.id
      this.$router.push({
        path: "/manager/addressedit",
        query: {
          item,
          index,
          userid,
        },
      });
    },
  },
  computed: {
    addressList() {
      // 筛选地址数据 生成匹配组件的数据
      let addressArr = this.addressData.list;
      let addressList = [];
      if (!addressArr) {
        return;
      }
      addressArr.forEach((item, index) => {
        let addressObj = {};
        (addressObj.id = item.id),
          (addressObj.name = item.username),
          (addressObj.tel = item.telephone),
          (addressObj.address =
            item.province + item.city + item.area + item.address),
          (addressObj.isDefault = item.isDefault);
        addressList.push(addressObj);
      });
      return addressList;
    },
  },
  created() {
    this.getUseraddress(this.$route.query.id);
  },
};
</script>

<style scoped>
</style>